<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>管理员信息管理</title>
    <style>
        body { font-family: Arial; margin: 20px; }
        form { margin-bottom: 20px; }
        input, button { margin: 5px; padding: 5px; }
        table { border-collapse: collapse; width: 100%; }
        th, td { border: 1px solid #ddd; padding: 8px; text-align: left; }
        th { background-color: #f2f2f2; }
    </style>
</head>
<body>
    <h1>管理员信息管理</h1>
    
    <div id="message"></div>
    
    <h2>添加/修改管理员</h2>
    <form id="admin-form">
        <input type="hidden" id="admin-id">
        <div>
            <label for="account">账号:</label>
            <input type="text" id="account" name="account" required>
        </div>
        <div>
            <label for="password">密码:</label>
            <input type="password" id="password" name="password" required>
        </div>
        <div>
            <label for="rid">账号等级:</label>
            <input type="text" id="rid" name="rid" required>
        </div>
        <div>
            <label for="createTime">创建时间:</label>
            <input type="text" id="createTime" name="createTime" required>
        </div>
        <div>
            <label for="describe">描述:</label>
            <input type="text" id="describe" name="describe" required>
        </div>
        <div>
            <label for="status">状态:</label>
            <input type="text" id="status" name="status" value="正常">
        </div>
        <button type="submit" id="submit-btn">添加</button>
        <button type="button" id="reset-btn">重置</button>
    </form>
    
    <h2>管理员列表</h2>
    <table id="admin-table">
        <thead>
            <tr>
                <th>ID</th>
                <th>账号</th>
                <th>密码</th>
                <th>账号等级</th>
                <th>创建时间</th>
                <th>描述</th>
                <th>状态</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody id="admin-tbody"></tbody>
    </table>

    <script>
        const API_URL = 'http://localhost:5001';
        let isEditing = false;
        
        // 显示消息
        function showMessage(message) {
            document.getElementById('message').textContent = message;
            setTimeout(() => {
                document.getElementById('message').textContent = '';
            }, 3000);
        }
        
        // 获取所有管理员
        async function getAdmins() {
            try {
                const response = await fetch(`${API_URL}/query`);
                const data = await response.json();
                if (data.status === 'success') {
                    displayAdmins(data.admins);
                } else {
                    showMessage(data.message);
                }
            } catch (error) {
                showMessage('获取管理员列表失败');
            }
        }
        
        // 显示管理员列表
        function displayAdmins(admins) {
            const tbody = document.getElementById('admin-tbody');
            tbody.innerHTML = '';
            
            admins.forEach(admin => {
                const tr = document.createElement('tr');
                tr.innerHTML = `
                    <td>${admin.id}</td>
                    <td>${admin.account}</td>
                    <td>${admin.password}</td>
                    <td>${admin.rid}</td>
                    <td>${admin.createTime}</td>
                    <td>${admin.describe}</td>
                    <td>${admin.status}</td>
                    <td>
                        <button onclick="editAdmin(${admin.id})">编辑</button>
                        <button onclick="deleteAdmin(${admin.id})">删除</button>
                    </td>
                `;
                tbody.appendChild(tr);
            });
        }
        
        // 添加管理员
        async function addAdmin(formData) {
            try {
                const response = await fetch(`${API_URL}/addadmin`, {
                    method: 'POST',
                    headers: {'Content-Type': 'application/json'},
                    body: JSON.stringify(formData)
                });
                const data = await response.json();
                showMessage(data.message);
                if (data.status === 'success') {
                    getAdmins();
                    resetForm();
                }
            } catch (error) {
                showMessage('添加管理员失败');
            }
        }
        
        // 更新管理员
        async function updateAdminData(id, formData) {
            formData.id = id;
            try {
                const response = await fetch(`${API_URL}/updateadmin`, {
                    method: 'POST',
                    headers: {'Content-Type': 'application/json'},
                    body: JSON.stringify(formData)
                });
                const data = await response.json();
                showMessage(data.message);
                if (data.status === 'success') {
                    getAdmins();
                    resetForm();
                }
            } catch (error) {
                showMessage('更新管理员失败');
            }
        }
        
        // 删除管理员
        async function deleteAdmin(id) {
            if (!confirm('确定要删除吗？')) return;
            
            try {
                const response = await fetch(`${API_URL}/deleteadmin`, {
                    method: 'DELETE',
                    headers: {'Content-Type': 'application/json'},
                    body: JSON.stringify({id: id})
                });
                const data = await response.json();
                showMessage(data.message);
                if (data.status === 'success') {
                    getAdmins();
                }
            } catch (error) {
                showMessage('删除管理员失败');
            }
        }
        
        // 编辑管理员
        async function editAdmin(id) {
            try {
                const response = await fetch(`${API_URL}/query?id=${id}`);
                const data = await response.json();
                
                if (data.status === 'success') {
                    const admin = data.admin;
                    document.getElementById('admin-id').value = admin.id;
                    document.getElementById('account').value = admin.account;
                    document.getElementById('password').value = admin.password;
                    document.getElementById('rid').value = admin.rid;
                    document.getElementById('createTime').value = admin.createTime;
                    document.getElementById('describe').value = admin.describe;
                    document.getElementById('status').value = admin.status;
                    
                    document.getElementById('submit-btn').textContent = '更新';
                    isEditing = true;
                } else {
                    showMessage(data.message);
                }
            } catch (error) {
                showMessage('获取管理员信息失败');
            }
        }
        
        // 重置表单
        function resetForm() {
            document.getElementById('admin-form').reset();
            document.getElementById('admin-id').value = '';
            document.getElementById('submit-btn').textContent = '添加';
            isEditing = false;
        }
        
        // 页面加载时获取管理员列表
        document.addEventListener('DOMContentLoaded', () => {
            // 设置当前时间为默认创建时间
            const now = new Date();
            document.getElementById('createTime').value = now.toLocaleString();
            
            // 获取管理员列表
            getAdmins();
            
            // 表单提交事件
            document.getElementById('admin-form').addEventListener('submit', function(e) {
                e.preventDefault();
                
                const formData = {
                    account: document.getElementById('account').value,
                    password: document.getElementById('password').value,
                    rid: document.getElementById('rid').value,
                    createTime: document.getElementById('createTime').value,
                    describe: document.getElementById('describe').value,
                    status: document.getElementById('status').value
                };
                
                if (isEditing) {
                    const id = document.getElementById('admin-id').value;
                    updateAdminData(id, formData);
                } else {
                    addAdmin(formData);
                }
            });
            
            // 重置按钮事件
            document.getElementById('reset-btn').addEventListener('click', resetForm);
        });
    </script>
</body>
</html> 